<!DOCTYPE html>
<html lang="en">
<head>
    <title>地图导航定位</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width,initial">
    <style rel="stylesheet" type="text/css">
        /*去除正文区域内外的间距:全屏*/
        body{margin:0;padding:0;}
        /*地图加载容器的大小*/
        #container{
        width:100%;
        height:100vh;
        }
    </style>
</head>
<body>
<!--地图呈现容器-->
<div id="container"></div>

<!--设置全局变量-->
<script type="text/javascript">
    //将密钥设置到全局
    //在当前window对象中挂载,_AMapSecurityConfig
    window._AMapSecurityConfig = {
    securityJsCode:'c8a98a57cdb4acc401473d910aab8b0a'
    };

</script>

<!--加载官方地图脚本:请附加申请key-->
<script
        type="text/javascript"
        src="https://webapi.amap.com/maps?v=2.0&key=e2345ebc3e170dade5bf8f7a74a04ce2"
>
</script>

<!--自定义脚本开发-->
<script type="text/javascript">
    //这里的代码默认执行
    //创建地图对象,进行初始化('绑定的容器',{配置})
    var map = new AMap.Map(
    'container',  //加载地图的容器id
        {
            zoom:25,  //初始地图的缩放比例
            center:[121.474815,31.237216]  //初始中心点的[经度,维度]
        }
        );
        //当前页面正式加载完毕后
    window.onload = function(){
        //调用鸿蒙端,代码注册过来的函数,设置定位点
        window.swift.setCurrentLocation()
    };
    //方法:定位设置
    function setLocation(lon,lat){
        //重新设置地图的中心点
        map.setZoomAndCenter(25,[lon,lat])
        //设置当前中心点的标记
        var marker = new AMap.Marker({
            map,
            icon:'https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
            position:[lon,lat]
            });

        //加入到地图中
        map.add(marker);

        //为地图新增插件能力:搜索
        map.plugin(['AMap.PlaceSearch'],function(){
            //创建搜索功能对象,提供搜索设置
            var MSearch = new AMap.PlaceSearch({
                map,  //绑定的地图组件
                pageSize:4,  //每页多少条
                pageIndex:1,  //第几页
                extensions:'base'  //扩展:基本信息
                });

            //为地图设置监听:当搜索结果完成时
            AMap.Event.addListener(MSearch,'complete',(res)=>{
                //调用鸿蒙方法,传回搜索结果
                //通讯传递,只能是字符串string
                window.swift.receiveNearPlace(JSON.stringify(res.poiList.pois))
            });

            //执行搜索:自动标记
            MSearch.searchNearBy('停车场',[lon,lat]);

        });



        }

</script>
</body>

</html>